<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  {{message}}
<!--  v-if  和v-show 的区别-->
<!--  v-if:当条件为false 时 包含v-if 的元素 根本就不会存在dom中-->
<!--  v-show 当条件为false 时 v-show只是给我们的元素添加一个行内样式 display:none-->
<!--  开发中 需要在显示和隐藏 切换频繁时 可以用v-show-->
<!--  当只有一次切换时 使用v-if  ，v-if使用的比较多-->
  <h2 v-if="isShow" id="aaa">v-if</h2>
  <h2 v-show="isShow" id="bbb">v-show</h2>

</div>
  <script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el:'#app',
    data:{
      message:"message",
      isShow:true,

    },
    methods:{

    }

  })
</script>

</body>
</html>